<template>
  <el-card class="user-table">
    <el-table :data="tableData">
      <el-table-column type="index" width="70"></el-table-column>
      <el-table-column 
      v-for="(val,key) in tableLabel"
      :key="key"
      :prop="key"
      :label="val"
      align="center" 
      >
    </el-table-column>
    </el-table>
  </el-card>
</template>


<script setup>
import { ref,getCurrentInstance,onMounted } from "vue";
import { ElTable } from 'element-plus'
const {proxy} = getCurrentInstance()


const tableData = ref([])

const getBookData =async ()=>{
  const data = await proxy.$api.getBookData()
  tableData.value = data.tableData
}

onMounted(() => {
  getBookData()
})

const tableLabel = ref({
  bookName:"书名",
    name: "作者",
    date: "入库日期",
    time: "借读次数",
})

</script>

<style scoped lang="less">

</style>